// JavaScript Document
/**
@description:千变万化的画图
@date : 2013-10-31
@author : undefined
@version : 2.0
@update by : WangTao 添加动态颜色，动态改变值等效果

*/
$(function(){   
	var x = 0.0;
	var y = 0.0;

	var a = -5;
	var b = -5;
	var c = 1;
	var d = 0;

	var isRepaint = false;//是否重画
	var run = true;//控制timerout执行
	var paintX = canvas.width/2;//取x中心点
	var paintY = canvas.height/2;//取y中心点
	window.speed = 500;//速度，默认500毫秒画一次
	var color = "#000000";//画笔颜色
	var isRandomColor = false;//是否用随机颜色
	window.animate = function (){
		if(isRepaint){
			x = y = 0.0;
		    ctx.fillStyle = "rgb(255,255,255)";//white #ffffff  重画先涂白,下面可以用clearRect();
			ctx.fillRect (0, 0, canvas.width, canvas.height);
			isRepaint = false;
		}
		if(isRandomColor){
			var randomColor = getRandomColor();
			ctx.fillStyle = randomColor;
			//console.log(randomColor);
		}else{
			ctx.fillStyle = color;  //  "rgb(0,0,0)" ; black ;#000000
		}
		for(var i = 0; i < 100; i++){ 
		    ctx.fillRect (paintX+x*100, paintY+y*100, 1, 1); 
			var tmpX = Math.sin(a*y) + c*Math.cos(a*x);
			var tmpY = Math.sin(b*x) + d*Math.cos(b*y);
			x = tmpX;
			y = tmpY;
		}
		if(run){
			run = setTimeout("this.animate();",speed); 
		}
	  	
	}
	
	//启动
	function start(){
		run = true;
		animate();
	}
	//停止
	function stop(){
		run = false;
		isRepaint = false;
	}
	//重画
	function repaint(){
		isRepaint = true;
	}
	//处理确定按钮点击事件
	$("#paintBtn").bind('click',function(evt){
		 start();
    });
	
	//////////////////////////////////////////////////////处理slider事件 start/////////////////////////////////////////////////////
	$("#paint_a").bind('change',function(e){
		var val = e.currentTarget.value;
		isRepaint = true;
		a = val;
		$("#paint_1").html(val);
		//$("#paint_1").html(Math.floor(val*100)+'°');
    });
	
	$("#paint_b").bind('change',function(e){
		var val = e.currentTarget.value;
		isRepaint = true;
		b = val;
		$("#paint_2").html(val);
		//$("#paint_2").html(Math.floor(val*100)+'°');
    });
	
	$("#paint_c").bind('change',function(e){
		var val = e.currentTarget.value;
		isRepaint = true;
		c = val;
		$("#paint_3").html(val);
    });
	
	$("#paint_d").bind('change',function(e){
		var val = e.currentTarget.value;
		isRepaint = true;
		d = val;
		$("#paint_4").html(val);
    });
	
	$("#paint_e").bind('change',function(e){
		var val = e.currentTarget.value;
		isRepaint = false;
		speed = val;
    });
	//////////////////////////////////////////////////////处理slider事件 end /////////////////////////////////////////////////////
	
	//点击color选择器
	$("#endlessColor").bind('change',function(e){
		var _color = e.currentTarget.value;
		isRepaint = true;
		color = _color;
    });
	//是否使用随机颜色
	
	$("#randomColorBtn").bind('click',function(e){
		if(isRandomColor){
			isRandomColor = false;
			$('#randomColorBtn').attr("title","点击开启随机颜色");
			$('#randomColorBtn').css("-webkit-filter",'invert(1)');
		}else{
			isRandomColor = true;
			$('#randomColorBtn').attr("title","点击关闭随机颜色");
			$('#randomColorBtn').css("-webkit-filter",'invert(0)');
		}
		isRepaint = true;
    });
	function addZero(str){
		return str.length == 2 ? str : '0' + str;
	}            
    //取色
    function toRGB(redValue, greenValue, blueValue)
    {
		rgbR = addZero(redValue.toString(16)),
		rgbG = addZero(greenValue.toString(16)),
		rgbB = addZero(blueValue.toString(16));
		var rgb = "#" + rgbR + rgbG + rgbB;
		return rgb;
    }
	//获得随机颜色
	function getRandomColor(){
		return toRGB(parseInt(Math.random()*256),
								parseInt(Math.random()*256),
									parseInt(Math.random()*256));
	}
	//显示窗口
	$("#binaryBtn").bind('click',function(evt){
		$("#autoPaint").get(0).style.left = '500px' 
		$("#autoPaint").get(0).style.top =  "200px";								  
		$("#autoPaint").fadeIn('slow');									 
   });
	//关闭窗口
	$("#paintCloseBtn").bind('click',function(evt){
		 closeWindow();		
   });
	//点击图标管理窗口
	$("#paintCloseIcon").bind('click',function(evt){
		closeWindow();					 
   });
	
	//关闭窗口
	function closeWindow(){
		$("#autoPaint").fadeOut('slow');									
		stop();
		Cache.saveImageToCache();//保存最后图像到缓存，redo时候使用
	}
	
		   
});
		